<template>
	<view class="store-upgrade-layout">
		<view class="store-upgrade-item">
			<text>商户姓名</text>
			<text class="store-upgrade-item-name">{{formParams.merPer}}</text>
			<view class="line"></view>
		</view>
		<view class="store-upgrade-item">
			<text>营业执照法人</text>
			<view class="store-upgrade-item-checkbox">
				<xh-checkbox text="同名" :isChecked="formParams.busNameType == '0'" @change="change1"></xh-checkbox>
				<xh-checkbox class="store-upgrade-item-checkbox2" text="不同名" :isChecked="formParams.busNameType == '1'" @change="change2"></xh-checkbox>
			</view>
			<view class="line"></view>
		</view>
		<!-- 营业执照信息 -->
		<store-upgrade-header title="营业执照图片"></store-upgrade-header>
		<view class="business-license-box" @tap="showSelectImageByType('business_license')">
			<image class="business-license-image" :src="formParams.busLicensePhoto" mode="scaleToFill" v-if="formParams.busLicensePhoto != ''"></image>
			<view class="business-license-default" v-else>
				<image class="business-license-default-icon" src="/static/my/take_photo_icon.png" mode="aspectFit"></image>
				<text>请上传营业执照信息</text>
			</view>
		</view>
		<xh-input showTitle required title="社会信用代码" v-model="formParams.busRegNo" placeholder="请与营业执照完全一致" @onBlur="endEdit"></xh-input>
		<xh-input showTitle required title="商户注册名称" v-model="formParams.companyName" placeholder="请与营业执照完全一致"></xh-input>
		<xh-input showTitle isSelect :showRightIcon="false" title="营业执照法人" v-model="formParams.abbrName" placeholder=""></xh-input>
		<store-upgrade-date v-model:startDate="formParams.busRegStart" v-model:endDate="formParams.busRegEnd" v-model:busRegType="formParams.busRegType" @checkChanged="checkChanged"></store-upgrade-date>
		<xh-input showTitle required isSelect title="所属行业" v-model="formParams.mccTypeName" placeholder="请选择" @didSelect="showSelectIndustry"></xh-input>
		<xh-input showTitle required isSelect title="经营区域" v-model="formParams.bussinessArea" placeholder="请选择" :showRightIcon="channelStore.channelType == 'QB'" @didSelect="showSelectArea"></xh-input>
		<xh-input showTitle required :isLine="false" title="经营详细地址" v-model="formParams.bussinessAddr" placeholder="请输入经营详细地址"></xh-input>
		<view class="bussiness-addr-box">
			<text>填写地址需要精确到xxx路xxx号</text>
		</view>
		<!-- 法人身份证和委托书 -->
		<view v-if="formParams.busNameType == '1'">
			<!-- 法人身份证 -->
			<store-upgrade-header title="营业执照法人身份证"></store-upgrade-header>
			<view class="store-upgrade-upload-box">
				<store-upgrade-upload-item title="点击上传法人正面照" v-model="formParams.certFrontPhoto" ocrType="idcard_front" @uploadResult="uploadResult"></store-upgrade-upload-item>
				<store-upgrade-upload-item class="store-upgrade-upload-item" ocrType="idcard_back" title="点击上传法人反面照" v-model="formParams.certBackPhoto" @uploadResult="uploadResult"></store-upgrade-upload-item>
			</view>
			<xh-input showTitle isSelect :showRightIcon="false" title="法人姓名" v-model="formParams.legalName" placeholder="通过法人正面照自动识别"></xh-input>
			<xh-input showTitle isSelect :showRightIcon="false" title="法人身份证号" v-model="formParams.certNo" placeholder="通过法人正面照自动识别"></xh-input>
			<store-upgrade-date :showLongTime="false" :isSelectDate="false" v-model:startDate="formParams.certStart" v-model:endDate="formParams.certEnd"></store-upgrade-date>

			<!-- 委托书 -->
			<store-upgrade-header title="法人委托书"></store-upgrade-header>
			<view class="store-upgrade-upload-box">
				<store-upgrade-upload-item title="点击上传委托书照片" v-model="formParams.wtsPhoto"></store-upgrade-upload-item>
				<view class="store-upgrade-upload-tip-box">
					<text class="store-upgrade-upload-tip-text" @tap="showExample">[查看示例]</text>
				</view>
			</view>
		</view>
		<!-- 补充店铺照片 -->
		<store-upgrade-header title="补充店铺照片"></store-upgrade-header>
		<view class="store-upgrade-upload-box">
			<store-upgrade-upload-item title="点击上传门头照" v-model="formParams.doorPhoto"></store-upgrade-upload-item>
			<store-upgrade-upload-item class="store-upgrade-upload-item" title="点击上传经营场所照" v-model="formParams.indoorPhoto"></store-upgrade-upload-item>
		</view>
		<view class="submit-box">
			<view class="submit-btn" @tap="submit">提交</view>
		</view>
		<xh-alert ref="alertRef" @submit="alertOkCallBack"></xh-alert>
		<xh-select-city ref="cityRef" :isArea="true" @result="selectCityResult"></xh-select-city>
	</view>
</template>

<script setup>
	import { onLoad, onUnload } from '@dcloudio/uni-app'
	import { ref } from 'vue'
	import dayjs from 'dayjs'
	import StoreUpgradeHeader from './widget/store-upgrade-header.vue'
	import StoreUpgradeUploadItem from './widget/store-upgrade-upload-item.vue'
	import StoreUpgradeDate from './widget/store-upgrade-date.vue'
	import { getStoreUpgradeInfo, getCompanyInfo, storeUpgrade } from '@/common/api/api.js'
	import { useChannelStore } from '@/common/stores'
	const channelStore = useChannelStore()
	const props = defineProps(['id'])

	const alertRef = ref(null)
	const cityRef = ref(null)
	const formParams = ref({
		//企业名称
		companyName: '',
		//营业执照编号
		busRegNo: '',
		//商户姓名
		merPer: '',
		//营业执照有效期类型 0 长期 1 有效期
		busRegType: '',
		//营业执照开始时间
		busRegStart: '',
		//营业执照结束时间
		busRegEnd: '',
		//注册资本
		registerAmount: '',
		//营业执照法人
		abbrName: '',
		//行业类型码
		mccType: '',
		//行业名称
		mccTypeName: '',
		//经营区域名称，英文逗号拼接
		bussinessArea: '',
		//经营区域编码，英文逗号拼接
		bussinessAreaCode: '',
		//经营地址
		bussinessAddr: '',
		//营业执照法人类型 0 同名 1 不同名
		busNameType: '0',
		//法人姓名
		legalName: '',
		//法人身份证号
		certNo: '',
		//法人身份证有效期开始日期
		certStart: '',
		//法人身份证有效期结束日期
		certEnd: '',
		//身份证有效期类型 0 长期 1 有效期
		certType: '1',
		//图片列表
		imageList: [],
		id: '',
		// 营业执照图片
		busLicensePhoto: '',
		// 内景照
		indoorPhoto: '',
		// 门头照
		doorPhoto: '',
		//委托书照片
		wtsPhoto: '',
		// 身份证正面照
		certFrontPhoto: '',
		//身份证反面照
		certBackPhoto: ''
	})
	// 选择同名法人
	const change1 = (res) => {
		console.log(res)
		formParams.value.busNameType = '0'
	}
	// 选择不同名法人
	const change2 = (res) => {
		console.log(res)
		if (res && formParams.value.busNameType == '0') {
			alertRef.value.open({ content: '营业执照法人选择非同名时，需要提供营业执照上法人的身份证信息和法人委托书' })
		}
	}
	// 弹框点击确认回调
	const alertOkCallBack = (res) => {
		formParams.value.busNameType = '1'
	}
	// 选择营业执照长期
	const checkChanged = (checked) => {
		if (checked) {
			formParams.value.busRegEnd = '长期'
		} else {
			formParams.value.busRegEnd = ''
		}
	}
	// 选择行业
	const showSelectIndustry = () => {
		uni.navigateTo({
			url: '/pages/home/merchant-manager/store-upgrade-list/store-upgrade/select-industry/select-industry'
		})
	}
	// 查看委托书示例图片
	const showExample = () => {
		uni.previewImage({
			urls: ['/static/home/wts.jpg']
		})
	}
	// 选择经营区域
	const showSelectArea = () => {
		if(channelStore.channelType == 'QB'){
			cityRef.value.open()
		}
	}
	// 选择经营区域结果
	const selectCityResult = (res) => {
		if (uni.$uv.test.empty(res.areaName)) {
			formParams.value.bussinessArea = `${res.provinceName},${res.cityName}`
			formParams.value.bussinessAreaCode = `${res.provinceCode},${res.cityCode
			}`
		} else {
			formParams.value.bussinessArea = `${res.provinceName},${res.cityName},${res.areaName}`
			formParams.value.bussinessAreaCode = `${res.provinceCode},${res.cityCode
			},${res.areaCode}`
		}

	}
	// 身份证照片上传ocr调用回调
	const uploadResult = (ocrRes) => {
		if (ocrRes.mode == 'idcard_front') {
			formParams.value.legalName = ocrRes.ocr.name
			formParams.value.certNo = ocrRes.ocr.idcard
		} else {
			formParams.value.certStart = ocrRes.ocr.startDate
			formParams.value.certEnd = ocrRes.ocr.endDate
			formParams.value.certType = ocrRes.ocr.endDate == '长期' ? '0' : '1'
		}
	}
	//选择营业执照图片
	const showSelectImageByType = async () => {
		const url = await uni.$utils.uploadImage()
		formParams.value.busLicensePhoto = url
		const ocrRes = await uni.$utils.getImageOcrInfo(url, 'business_license')
		if (!uni.$uv.test.empty(ocrRes.ocr)) {
			formParams.value.busRegNo = ocrRes.ocr.busLicenseId
			formParams.value.companyName = ocrRes.ocr.company
			formParams.value.busRegStart = ocrRes.ocr.startDate
			if (ocrRes.ocr.endDate == '长期') {
				formParams.value.busRegEnd = '长期'
				businessEndDateValue.value = 0
				formParams.value.busRegType = '0'
			} else {
				formParams.value.busRegEnd = ocrRes.ocr.endDate
				businessEndDateValue = dayjs(ocrRes.ocr.endDate).valueOf()
				formParams.value.busRegType = '1'
			}
		}
	}
	// 获取商户店铺升级信息
	const getStoreUpgradeInfoData = async () => {
		const res = await getStoreUpgradeInfo({ id: props.id })
		formParams.value = res.result
		formParams.value.busNameType = res.result.busNameType || '0'
		if (res.result.busRegType == '0') {
			formParams.value.busRegEnd = '长期'
		}
		//照片类型 0:营业执照照片 1:场所照 2:收银台照 3:门头照 4:门牌号照 5法人正面照 6 法人反面照 7 委托书
		res.result.imageList.forEach(item => {
			if (item.imageType == '0') {
				formParams.value.busLicensePhoto = item.imageUrl
			} else if (item.imageType == '1') {
				formParams.value.indoorPhoto = item.imageUrl
			} else if (item.imageType == '3') {
				formParams.value.doorPhoto = item.imageUrl
			} else if (item.imageType == '5') {
				formParams.value.certFrontPhoto = item.imageUrl
			} else if (item.imageType == '6') {
				formParams.value.certBackPhoto = item.imageUrl
			} else if (item.imageType == '7') {
				formParams.value.wtsPhoto = item.imageUrl
			}
		})
		getCompanyInfoData()
	}
	// 营业执照号编辑结束调用查询企业信息
	const endEdit = () => {
		getCompanyInfoData()
	}
	// 获取企业信息
	const getCompanyInfoData = async () => {
		const res = await getCompanyInfo({ qccBusLicenseId: formParams.value.busRegNo })
		const data = res.result
		formParams.value.companyName = data.companyName;
		formParams.value.abbrName = data.personName;
		formParams.value.busRegStart = dayjs(data.oprStartDate).format('YYYY-MM-DD')
		if (data.oprEndDate.includes('9999-09-09') || data.oprEndDate == '') {
			formParams.value.busRegEnd = '长期'
			formParams.value.busRegType = '0'
		} else {
			formParams.value.busRegType = '1'
			formParams.value.busRegEnd = dayjs(data.oprEndDate).format('YYYY-MM-DD')
		}
	}
	// 提交店铺升级
	const submit = () => {
		if (uni.$uv.test.empty(formParams.value.merPer)) {
			uni.$utils.showToast('商户姓名不能为空')
			return
		} else if (uni.$uv.test.empty(formParams.value.busNameType)) {
			uni.$utils.showToast('请选择营业执照法人类型')
			return
		} else if (uni.$uv.test.empty(formParams.value.busLicensePhoto)) {
			uni.$utils.showToast('请上传营业执照图片')
			return
		} else if (uni.$uv.test.empty(formParams.value.busRegNo)) {
			uni.$utils.showToast('请输入社会信用代码')
			return
		} else if (uni.$uv.test.empty(formParams.value.companyName)) {
			uni.$utils.showToast('请输入商户注册名称')
			return
		} else if (uni.$uv.test.empty(formParams.value.abbrName)) {
			uni.$utils.showToast('通过社会信用代码获取营业执照法人姓名')
			return
		} else if (uni.$uv.test.empty(formParams.value.busRegStart)) {
			uni.$utils.showToast('请选择营业执照有效期开始日期')
			return
		} else if (uni.$uv.test.empty(formParams.value.busRegEnd) && formParams.value.busRegType == '1') {
			uni.$utils.showToast('请选择执照有效期结束日期')
			return
		} else if (uni.$uv.test.empty(formParams.value.mccTypeName)) {
			uni.$utils.showToast('请选择所属行业')
			return
		} else if (uni.$uv.test.empty(formParams.value.bussinessArea)) {
			uni.$utils.showToast('请选择经营区域')
			return
		} else if (uni.$uv.test.empty(formParams.value.bussinessAddr)) {
			uni.$utils.showToast('请输入经营详细地址')
			return
		} else if (formParams.value.busNameType == '1' && uni.$uv.test.empty(formParams.value.certFrontPhoto)) {
			uni.$utils.showToast('请上传法人正面照')
			return
		} else if (formParams.value.busNameType == '1' && uni.$uv.test.empty(formParams.value.certBackPhoto)) {
			uni.$utils.showToast('请上传法人反面照')
			return
		} else if (formParams.value.busNameType == '1' && uni.$uv.test.empty(formParams.value.legalName)) {
			uni.$utils.showToast('法人姓名不能为空')
			return
		} else if (formParams.value.busNameType == '1' && formParams.value.legalName != formParams.value.abbrName) {
			uni.$utils.showToast('身份证姓名与法人姓名不符，请重新上传法人身份证照')
			return
		} else if (formParams.value.busNameType == '1' && uni.$uv.test.empty(formParams.value.certNo)) {
			uni.$utils.showToast('法人身份证号不能为空')
			return
		} else if (formParams.value.busNameType == '1' && uni.$uv.test.empty(formParams.value.certStart)) {
			uni.$utils.showToast('法人证件有效期开始日期不能为空')
			return
		} else if (formParams.value.busNameType == '1' && uni.$uv.test.empty(formParams.value.certEnd) && formParams.value.certType == '1') {
			uni.$utils.showToast('法人证件有效期结束日期不能为空')
			return
		} else if (formParams.value.busNameType == '1' && uni.$uv.test.empty(formParams.value.wtsPhoto)) {
			uni.$utils.showToast('请上传委托书照片')
			return
		} else if (uni.$uv.test.empty(formParams.value.doorPhoto)) {
			uni.$utils.showToast('请上传门头照')
			return
		} else if (uni.$uv.test.empty(formParams.value.indoorPhoto)) {
			uni.$utils.showToast('请上传经营场所照')
			return
		} else if (formParams.value.busNameType == '0' && formParams.value.merPer != formParams.value.abbrName) {
			uni.$utils.showToast('营业执照法人姓名需跟商户法人保持一致')
			return
		}
		submitStoreUpgardeData()
	}
	// 提交店铺升级数据
	const submitStoreUpgardeData = async () => {
		let params = {}
		params.id = props.id
		params.companyName = uni.$uv.trim(formParams.value.companyName)
		params.busRegNo = uni.$uv.trim(formParams.value.busRegNo)
		params.merPer = formParams.value.merPer
		params.busRegType = formParams.value.busRegType
		params.busRegStart = formParams.value.busRegStart
		if (formParams.value.busRegType == '0') {
			params.busRegEnd = '2199-12-30'
		} else {
			params.busRegEnd = formParams.value.busRegEnd
		}
		if (formParams.value.registerAmount && !uni.$uv.test.empty(formParams.value.registerAmount)) {
			params.registerAmount = formParams.value.registerAmount
		}
		params.abbrName = formParams.value.abbrName
		params.mccType = formParams.value.mccType
		params.mccTypeName = formParams.value.mccTypeName
		params.bussinessArea = formParams.value.bussinessArea
		params.bussinessAreaCode = formParams.value.bussinessAreaCode
		params.bussinessAddr = uni.$uv.trim(formParams.value.bussinessAddr)
		params.busNameType = formParams.value.busNameType
		let imageList = [
			{ imageType: '0', imageUrl: formParams.value.busLicensePhoto },
			{ imageType: '1', imageUrl: formParams.value.indoorPhoto },
			{ imageType: '3', imageUrl: formParams.value.doorPhoto }
		]
		if (formParams.value.busNameType == '1') {
			imageList.push({ imageType: '5', imageUrl: formParams.value.certFrontPhoto })
			imageList.push({ imageType: '6', imageUrl: formParams.value.certBackPhoto })
			imageList.push({ imageType: '7', imageUrl: formParams.value.wtsPhoto })
			params.imageList = imageList
			params.legalName = uni.$uv.trim(formParams.value.legalName)
			params.certNo = uni.$uv.trim(formParams.value.certNo)
			params.certStart = formParams.value.certStart
			if (formParams.value.certType == '0') {
				params.certEnd = '2199-12-30'
			} else {
				params.certEnd = formParams.value.certEnd
			}
		}
		await storeUpgrade(params)
		uni.redirectTo({
			url: '/pages/home/merchant-manager/store-upgrade-list/store-upgrade/store-upgrade-result/store-upgrade-result'
		})
	}
	onLoad(() => {
		uni.$off('selectIndustryResult')
		uni.$on('selectIndustryResult', (res) => {
			formParams.value.mccType = res.code
			formParams.value.mccTypeName = res.name
		})
		getStoreUpgradeInfoData()
	})
	onUnload(() => {
		uni.$off('selectIndustryResult')
	})
</script>

<style lang="scss" scoped>
	.store-upgrade-layout {
		.store-upgrade-item {
			display: flex;
			align-items: center;
			background-color: #ffffff;
			height: 100rpx;
			position: relative;
			padding: 0 30rpx;

			.store-upgrade-item-name {
				margin-left: 80rpx;
			}

			.store-upgrade-item-checkbox {
				display: flex;
				align-items: center;
				margin-left: 60rpx;

				.store-upgrade-item-checkbox2 {
					margin-left: 60rpx;
				}
			}
		}

		.business-license-box {
			background-color: #ffffff;
			padding: 30rpx 30rpx 0;
			position: relative;

			.business-license-image {
				width: 100%;
				height: 268rpx;
			}

			.business-license-default {
				height: 268rpx;
				background-color: $xh-bg-color;
				display: flex;
				align-items: center;
				justify-content: center;
				flex-direction: column;
				color: #909399;

				.business-license-default-icon {
					width: 102rpx;
					height: 84rpx;
					margin-bottom: 20rpx;

				}
			}
		}

		.bussiness-addr-box {
			background-color: #ffffff;
			padding: 0 30rpx 30rpx;
			font-size: 24rpx;
			color: $xh-red-color;
		}

		.store-upgrade-upload-box {
			display: flex;
			padding: 30rpx;
			background-color: #ffffff;

			.store-upgrade-upload-item {
				margin-left: 30rpx;
			}

			.store-upgrade-upload-tip-box {
				flex: 1;
				position: relative;

				.store-upgrade-upload-tip-text {
					position: absolute;
					left: 0;
					bottom: 0;
					color: $xh-red-color;
					font-size: 26rpx;
				}
			}
		}

		.submit-box {
			background-color: #ffffff;
			padding: 50rpx 0;
		}
	}
</style>